@import "../base/base";
@prefix:huimei-company;
.@{prefix}{
  p{
    font-size: 16px;
    margin-top: 10px;
    .max-media(600px,{
      font-size: 14px;
    });
  }
  h1{
    color: #fff;
    font-size: 36px;
    position: relative;
    margin-bottom: 30px;
    .max-media(600px,{
      font-size: 28px;
    });
    &:after{
      position: absolute;
      content: "";
      background: #fff;
      width: 100px;
      height: 5px;
      left: 0px;
      bottom: -15px;
      .translate(0,-50%);
    }
  }
  h3{
    color: #fff;
    font-size: 22px;
    .max-media(600px,{
      font-size: 18px;
    });
  }
  .@{prefix}-first-screen{
    background: url("./img/banner1.jpg") no-repeat center;
    background-size: cover;
    .@{prefix}-content{
      color: #fff;
      max-width: 600px;
      position: absolute;
      left: 0;
      top: 30%;
      padding: 0 20px;
      .max-media(600px,{
        top:15%;
        padding: 0 10px;
      });
    }
  }
  .@{prefix}-second-screen{
    background: url("./img/banner2.jpg") no-repeat center;
    background-size: cover;
    .@{prefix}-content{
      color: #fff;
      background: rgba(0,0,0,.5);
      max-width: 600px;
      height: 100%;
      padding: 0 20px;
      display: table;
      .max-media(1200px,{
        max-width: 100%;
      });
      .@{prefix}-table-cell{
        display: table-cell;
        vertical-align: middle;
      }
    }
  }
  .@{prefix}-third-screen{
    background: url("./img/banner3.jpg") no-repeat center;
    background-size: cover;
    .@{prefix}-content{
      color: #fff;
      max-width: 620px;
      position: absolute;
      left: 0;
      top: 50%;
      .translate(0,-50%);
      padding: 0 20px;
      p{
        margin-top: 0;
        margin-bottom: 15px;
      }
    }
  }
  .@{prefix}-box{
    max-width: 1200px;
    height: 100%;
    margin: 0 auto;
    position: relative;

  }
}